(function ()
{
    var canvas = document.getElementById("first-canvas");
    var ctx = canvas.getContext("2d");

    ctx.strokeStyle = "#1F505A";
    ctx.fillStyle = "#90CAD7";
    ctx.lineWidth = 2;

    ctx.save();
    ctx.scale(1, 0.9);
    ctx.beginPath();
    ctx.arc(80, 145, 45, 0, 360 * Math.PI / 180);
    ctx.fill();
    ctx.stroke();
    ctx.restore();

    ctx.save();
    ctx.scale(1, 0.65);
    ctx.beginPath();
    ctx.arc(55, 180, 10, 0, 360 * Math.PI / 180);
    ctx.fill();
    ctx.stroke();
    ctx.restore();

    ctx.save();
    ctx.scale(1, 0.65);
    ctx.beginPath();
    ctx.arc(87, 180, 10, 0, 360 * Math.PI / 180);
    ctx.fill();
    ctx.stroke();
    ctx.restore();

    ctx.fillStyle = "#1F505A";

    ctx.save();
    ctx.scale(0.60, 1);
    ctx.beginPath();
    ctx.arc(88, 117, 5.5, 0, 360 * Math.PI / 180);
    ctx.fill();
    ctx.stroke();
    ctx.restore();

    ctx.save();
    ctx.scale(0.60, 1);
    ctx.beginPath();
    ctx.arc(142, 117, 5.5, 0, 360 * Math.PI / 180);
    ctx.fill();
    ctx.stroke();
    ctx.restore();

    ctx.fillStyle = "#90CAD7";

    ctx.moveTo(70, 118);
    ctx.lineTo(60, 138);
    ctx.moveTo(70, 138);
    ctx.lineTo(60, 138);
    ctx.stroke();

    ctx.save();
    ctx.translate(20, 495);
    ctx.rotate(0.15);
    ctx.translate(-20, -495);
    ctx.scale(1, 0.30);
    ctx.beginPath();
    ctx.arc(20, 495, 20, 0, 360 * Math.PI / 180);
    ctx.stroke();
    ctx.restore();

    ctx.strokeStyle = "#25221F";
    ctx.fillStyle = "#396693";

    ctx.save();
    ctx.scale(1, 0.25);
    ctx.beginPath();
    ctx.arc(80, 360, 50, 0, 360 * Math.PI / 180);
    ctx.fill();
    ctx.stroke();
    ctx.restore();

    ctx.beginPath();
    ctx.fillRect(50, 40, 60, 40);
    ctx.strokeRect(50, 40, 60, 40);

    ctx.save();
    ctx.scale(1, 0.40);
    ctx.beginPath();
    ctx.arc(80, 200, 30, 0, 360 * Math.PI / 180);
    ctx.fill();
    ctx.stroke();
    ctx.restore();
    ctx.fillRect(50, 51, 60, 30);

    ctx.save();
    ctx.scale(1, 0.40);
    ctx.beginPath();
    ctx.arc(80, 90, 30, 0, 360 * Math.PI / 180);
    ctx.fill();
    ctx.stroke();
    ctx.restore();

    // bicycle
    ctx.strokeStyle = "#1F505A";
    ctx.fillStyle = "#90CAD7";
    ctx.lineWidth = 2;

    ctx.save();
    ctx.scale(1, 1);
    ctx.beginPath();
    ctx.arc(280, 140, 45, 0, 360 * Math.PI / 180);
    ctx.fill();
    ctx.stroke();
    ctx.restore();
    ctx.save();
    ctx.scale(1, 1);
    ctx.beginPath();
    ctx.arc(460, 140, 45, 0, 360 * Math.PI / 180);
    ctx.fill();
    ctx.stroke();
    ctx.restore();

    ctx.moveTo(460, 140);
    ctx.lineTo(440, 40);
    ctx.moveTo(400, 50);
    ctx.lineTo(440, 40);
    ctx.moveTo(475, 10);
    ctx.lineTo(440, 40);
    ctx.stroke();

    ctx.beginPath();
    ctx.arc(360, 140, 15, 0, 2 * Math.PI, false);
    ctx.stroke();
    ctx.moveTo(350, 130);
    ctx.lineTo(338, 118);
    ctx.moveTo(370, 150);
    ctx.lineTo(382, 162);
    ctx.stroke();

    ctx.moveTo(360, 140);
    ctx.lineTo(320, 50);
    ctx.moveTo(300, 50);
    ctx.lineTo(340, 50);
    ctx.stroke();

    ctx.moveTo(360, 140);
    ctx.lineTo(280, 140);
    ctx.moveTo(330, 70);
    ctx.lineTo(280, 140);
    ctx.moveTo(445, 70);
    ctx.lineTo(330, 70);
    ctx.moveTo(445, 70);
    ctx.lineTo(360, 140);
    ctx.stroke();

    // house
    var house = document.getElementById("house");
    var ctx = house.getContext("2d");
    ctx.strokeStyle = "#000";
    ctx.fillStyle = "#975B5B";
    ctx.lineWidth = 3;

    ctx.save();
    ctx.translate(150, 0);
    ctx.rotate(Math.PI / 4);
    ctx.translate(-150, -0);
    ctx.beginPath();
    ctx.fillRect(150, 0, 196, 196);
    ctx.strokeRect(150, 0, 196, 196);
    ctx.restore();

    ctx.beginPath();
    ctx.fillRect(210, 30, 32, 85);
    ctx.strokeRect(210, 30, 32, 85);
    ctx.beginPath();
    ctx.fillRect(211, 30, 30, 90);

    ctx.save();
    ctx.scale(1, 0.4);
    ctx.beginPath();
    ctx.arc(226, 75, 16, 0, 2 * Math.PI);
    ctx.fill();
    ctx.stroke();
    ctx.restore();

    ctx.beginPath();
    ctx.fillRect(10, 141, 280, 210);
    ctx.strokeRect(10, 141, 280, 210);

    ctx.beginPath();
    ctx.fillRect(40, 275, 80, 76);
    ctx.strokeRect(40, 275, 80, 76);

    ctx.save();
    ctx.scale(1, 0.5);
    ctx.beginPath();
    ctx.arc(80, 550, 40, 0, Math.PI, true);
    ctx.fill();
    ctx.stroke();
    ctx.restore();

    ctx.save();
    ctx.scale(1, 0.5);
    ctx.beginPath();
    ctx.arc(80, 555, 38.5, 0, 2 * Math.PI);
    ctx.fill();
    ctx.restore();
    ctx.beginPath();
    ctx.moveTo(80, 351);
    ctx.lineTo(80, 254);
    ctx.stroke();

    ctx.save();
    ctx.scale(1, 1);
    ctx.beginPath();
    ctx.arc(65, 323, 5, 0, 2 * Math.PI, true);
    ctx.fill();
    ctx.stroke();
    ctx.restore();
    ctx.save();
    ctx.scale(1, 1);
    ctx.beginPath();
    ctx.arc(95, 323, 5, 0, 2 * Math.PI, true);
    ctx.fill();
    ctx.stroke();
    ctx.restore();

    ctx.strokeStyle = "#975B5B";
    ctx.fillStyle = "#000";

    ctx.beginPath();
    ctx.fillRect(30, 165, 50, 35);
    ctx.strokeRect(30, 165, 50, 35);
    ctx.beginPath();

    ctx.beginPath();
    ctx.fillRect(82, 165, 50, 35);
    ctx.strokeRect(82, 165, 50, 35);
    ctx.beginPath();

    ctx.beginPath();
    ctx.fillRect(168, 165, 50, 35);
    ctx.strokeRect(168, 165, 50, 35);
    ctx.beginPath();

    ctx.beginPath();
    ctx.fillRect(220, 165, 50, 35);
    ctx.strokeRect(220, 165, 50, 35);
    ctx.beginPath();

    ctx.beginPath();
    ctx.fillRect(30, 202, 50, 35);
    ctx.strokeRect(30, 202, 50, 35);
    ctx.beginPath();

    ctx.beginPath();
    ctx.fillRect(82, 202, 50, 35);
    ctx.strokeRect(82, 202, 50, 35);
    ctx.beginPath();

    ctx.beginPath();
    ctx.fillRect(168, 202, 50, 35);
    ctx.strokeRect(168, 202, 50, 35);
    ctx.beginPath();

    ctx.beginPath();
    ctx.fillRect(220, 202, 50, 35);
    ctx.strokeRect(220, 202, 50, 35);
    ctx.beginPath();

    ctx.beginPath();
    ctx.fillRect(168, 260, 50, 35);
    ctx.strokeRect(168, 260, 50, 35);

    ctx.beginPath();
    ctx.fillRect(220, 260, 50, 35);
    ctx.strokeRect(220, 260, 50, 35);
    ctx.beginPath();

    ctx.beginPath();
    ctx.fillRect(168, 297, 50, 35);
    ctx.strokeRect(168, 297, 50, 35);
    ctx.beginPath();

    ctx.beginPath();
    ctx.fillRect(220, 297, 50, 35);
    ctx.strokeRect(220, 297, 50, 35);
    ctx.beginPath();
}());